<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        img{
            width:100px;
            height:100px;
        }
    </style>
</head>
<body>
<img id="simg" src="/static/w2/day3/images/car.png" alt="xxx">
<p class="desc">这是美女描述</p>
<div class="desc2">我是div之间的内容</div>
<button id="btn">按钮</button>

<script>
    //获取id是btn的按钮
    let btn=document.querySelector('#btn');

    //事件机制
    btn.onclick=function () {
        //获取p标签，更改p标签之间的内容
        let desc=document.querySelector('.desc');
        let div=document.querySelector('.desc2');
        //更改标签之间的文本内容
        //里面的内容会原封不动的显示出来
        desc.textContent='这是第二个';
        //获取标签之间的内容
        console.log(desc.textContent);

        //innerHTML中设置得到html会被渲染
        desc.innerHTML="<h3>标题</h3>";

        div.textContent="尝试修改div之间的文字"
    }
</script>
</body>
</html>